<template>
     <!-- 头部搜索框 start -->
     <nav class="nav-box">
        <div class="nav-input">
            <input type="text" @blur="changeShowBtn(false)" @focus="changeShowBtn(true)">
        </div>
        <div v-show="showBtn" class="nav-btn">
            <span>{{search}}</span>
        </div>
    </nav>
    <!-- 头部搜索框 end -->
</template>
<script>
    var navBar=Vue.extend({
        template:document.currentScript.ownerDocument.querySelector("template"),
        data(){
            return {
                search:"搜索",
                showBtn:false
            }
        },
        methods:{
            changeShowBtn(arg){
                this.showBtn=arg;
            }
        }
    })
</script>